<template>
	<view class="base_card" @click="handleClick">
		<image :src="item?.baseImage" class="base_card_img"></image>
		<view class="base_card_btm">
			<view class="base_card_btm_title">{{item?.baseName}}</view>
			<view class="base_card_btm_subtitle">基地类型：{{item?.baseTypesName}}</view>
			<view class="base_card_btm_btm">{{item?.viewNum}}次浏览</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	const emit = defineEmits(['handleEmit']);
	const { item } = defineProps({
		item: {
			type: Object,
			default: () => ({}),
		},
	});

	/**
	 * 跳转
	 */
	function handleClick() {
		emit('handleEmit', item)
		uni.$u.route('/pages/index/baseDetails', {
			id: item?.id
		});
	}
</script>

<style lang="scss" scoped>
	.base_card {
		border-radius: 24rpx;
		margin: 0 24rpx 32rpx 24rpx;
		display: flex;
		flex-direction: column;

		.base_card_img {
			width: 100%;
			height: 380rpx;
			border-radius: 24rpx 24rpx 0 0;
		}

		.base_card_btm {
			background-color: #fff;
			border-radius: 0 0 24rpx 24rpx;
			padding: 24rpx;

			.base_card_btm_title {
				font-size: 36rpx;
				font-weight: 600;
			}

			.base_card_btm_subtitle {
				font-size: 30rpx;
				margin: 16rpx 0;
			}

			.base_card_btm_btm {
				font-size: 24rpx;
				color: #9E9E9E;
			}
		}
	}
</style>